import React from 'react';
import { Button, Tooltip, message } from 'antd';
import List from './list';
import CommonListsIndex from '../../../../components/CommonLists/index';
import IndicatorAdd from '../add';
import services from '../../../../services/api';

class RelationFn extends CommonListsIndex {
  constructor(props) {
    super(props);
    this.relationApi = props.relationApi;
    this.editComponent = IndicatorAdd;
    this.listsComponent = List;
    this.queryTableParams = {
      ...props.param,
      refCode: props.code,
    };
    this.initQueryPanigation = {
      current_page: 1,
      page_size: 10,
    };
  }
  componentDidMount() {
    this.freshQueryList();
  }

  // 列表
  queryList(params = {}) {
    this.setState({
      loading: true,
    });
    services.fn[this.relationApi](params).then((res) => {
      if (res.code === '0') {
        const { list, records, totalCount, total } = res.data;
        const curList = this.queryPanigation.size ? list : records;
        const curTotal = this.queryPanigation.size ? totalCount : total;
        const currentPage = params.current || params.page;
        const page = Math.ceil(
          curTotal / (this.queryPanigation.size ? this.queryPanigation.size : this.queryPanigation.size)
        );
        if (curList && curTotal && curList.length === 0 && currentPage > page) {
          this.onChangePagination(page, 'current');
        } else {
          this.setState({
            ...res.data,
          });
        }
      } else {
        message.error(res.msg);
      }
      this.setState({
        loading: false,
      });
    });
  }

  getColumns = () => {
    return [
      {
        title: '名称',
        key: 'name',
        dataIndex: 'name',
      },

      {
        title: 'code',
        dataIndex: 'code',
        key: 'code',
      },
      {
        title: '所属项目',
        dataIndex: 'projectName',
        key: 'projectName',
      },
    ];
  };

  render() {
    const ListsComponent = this.listsComponent;

    return (
      <div className='inner-content' style={{ marginTop: '-15px', marginBottom: '30px' }}>
        <ListsComponent
          {...this.state}
          rowKey='feature_id'
          queryList={this.freshQueryList}
          columns={this.getColumns()}
          onChangePagination={this.onChangePagination}
        />
      </div>
    );
  }
}

export default RelationFn;
